<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title>表单元素</title>
	</head>
	<body>
		<!-- 表单元素：采集用户信息，并提交信息到服务器 
		采集用户信息元素 input 必须属性 type决定input呈现效果
		重点掌握type中属性值    text    文本框
                            password   密文文本框
							submit    提交     结合表单元素
							button    按钮   【html4.0写法加value="按钮名称"】
		                    reset    重置   结合表单元素
		                   color     颜色
						   datetime-local 本地日期时间插件
						   date     年日月插件
						   time     时分插件
						   week    周插件
						   range   滑块
						   file    文件
						   radio   单选框  结合name
						   checkbox   复选框    checked默认选择
						   image   图片按钮 结合src属性使用
						   hidden   隐藏   结合JS
						   
		-->
		<form>
			<h1>控件元素</h1>
		账号：<input type="text"><br/>
		密码：<input type="password"><br />
		<input type="submit">
		<input type="button" value="自定义按钮">
		<!-- html5.0写法 -->
		<button>点击按钮</button>
		<input type="reset"><br/>
		<input type="color">
		<input type="datetime-local"/>
		<input type="date">
		<input type="time">
		<input type="week">
		<input type="range">
		<input type="file"><br/>
		男<input type="radio" name="a" checked="checked">
		女<input type="radio" name="a">
		<input type="checkbox" />红烧肉
	    <input type="checkbox" checked />麻辣烫
		<input type="image" src="img/1.png"/>
		<input type="hidden">
		<h1>下拉列表元素</h1>
		<!-- 层叠元素 快捷键：select>option -->
		发车时间：<select>
			
				<option >00:00--24:00</option>
				<option >00:00--06:00</option>
				<option >06:00--12:00</option>
				<option >12:00--18:00</option>
				<option >18:00--24:00</option>
				
			</select>
			<h1>超大文本框元素</h1>
			建议:<textarea cols="50"rows="10"></textarea>
			<!-- 细节元素  层叠元素 快捷键：details>summary+div -->
			<h1>细节元素</h1>
			<details>
				<summary>征军启示</summary>
				<div>Lorem ipsum, dolor sit amet consectetur adipisicing elit. Similique dignissimos ad voluptatum itaque sed cum quasi natus rem dolorum corporis explicabo, sapiente blanditiis possimus? Blanditiis eligendi voluptatem dolorem labore quam. Lorem ipsum dolor sit amet consectetur adipisicing elit. Ipsa consequuntur distinctio, iusto laudantium ipsam accusamus nobis numquam. Velit sunt, voluptas expedita tempora nostrum quod culpa animi magni temporibus numquam vel?  </div>
			</details>
		</form>
		<h1>新元素</h1>
		<!-- 记号笔元素 ：-->
		周五<mark>放假了</mark>
		<!-- 度量元素 value度量单位="默认：0~1"值 -->
		电量：<meter></meter>
	</body>
</html>